<template>
    <div>
        <a-modal v-model:visible="modalVisible" title="注销账户" @ok="handleOk">
            <div>
                <div class="fz-14 mb-16" style="color: #F1330D;">！注意：账户注销后，所有账户信息都会被清除，包括实例、存储数据等，且无法被恢复</div>
                <div>
                    <a-checkbox v-model:checked="checked"><span class="fz-14 mb-16 col-8A93A7">仍确定注销账户</span></a-checkbox>
                </div>
            </div>
        </a-modal>
    </div>
</template>

<script setup>
import { defineProps, defineEmits, computed, ref } from 'vue';
import { XsyMessage } from '@/libs/util.toast'
import { logOffApi } from 'api/modules/api.account'
import { useDbStore } from '@/stores/db.js'
const db = useDbStore()

const props = defineProps({
    modelValue: {
        type: Boolean,
    },
});

const checked = ref(false)
const emit = defineEmits(['update:modelValue']);
const modalVisible = computed({
    get: () => props.modelValue,
    set: v => emit('update:modelValue', v),
});
// 确定按钮的回调
const handleOk = () => {
    if (!checked.value) {
        XsyMessage.warning('请勾选风险提示')
    } else {
        logOffApi().then(res => {
            if (res.code == 0) {
                XsyMessage.success('注销成功')
                db.removeAllInfo()
                location.href = import.meta.env.VITE_BASE_PATH;
            }
        })
    }
};

</script>

